<!DOCTYPE html>
<html>
<head>
<title>billCondition.html</title>

<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="/Hospital/lib/layui-v2.1.6/layui/css/layui.css" media="all">
<style type="text/css">
select {
	height: 38px;
	line-height: 1.3;
	line-height: 38px\9;
	border-width: 1px;
	border-style: solid;
	background-color: #fff;
	border-radius: 2px;
	width: 100%;
}

h1 {
	color: #c2c2c2;
	line-height: 25px;
	font-size: 16px;
	text-align: center;
	margin-top: 5px;
}

legend {
	font: 22px Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial,
		sans-serif;
	width: auto;
	margin: 0px auto;
}

.row {
	margin-top: 10px;
}

.no_border {
	border: 0px;
}

#btn_search {
	margin-top: 8px;
	margin-left: -25px;
}

.content_center {
	text-align: center;
}
</style>
</head>

<body>
	<!-- <fieldset style="border-width: 0px;margin-top:25px">
		<legend>
			<a>治疗单据所属信息</a>
		</legend>
	</fieldset> -->
	<div id="div_doctorTable" class="layui-form layui-container" style="display:none">
		<div class="layui-row row">
			<div class="layui-col-xs3 layui-col-xs-offset1 layui-col-sm2 layui-col-sm-offset1 layui-col-md2 layui-col-md-offset2">
				<span class="layui-form-label">所属门诊: </span>
			</div>
			<div class="layui-col-xs5 layui-col-sm3 layui-col-md2 ">
				<input id="clinic" class="layui-input" type="text" disabled="">
			</div>
		</div>

		<div class="layui-row row">
			<div class="layui-col-xs3 layui-col-xs-offset1 layui-col-sm2 layui-col-sm-offset1 layui-col-md2 layui-col-md-offset2">
				<span class="layui-form-label">所属科室: </span>
			</div>
			<div class="layui-col-xs5 layui-col-sm3 layui-col-md2">
				<select id="department" name="department" class="layui-input-inline" lay-filter="department">
				</select>
			</div>
		</div>

		<div id="div_doctor" class="layui-row row">
			<div class="layui-col-xs3 layui-col-xs-offset1 layui-col-sm2 layui-col-sm-offset1 layui-col-md2 layui-col-md-offset2">
				<span class="layui-form-label">开单医生: </span>
			</div>
			<div class="layui-col-xs5 layui-col-sm3 layui-col-md2">
				<select id="doctor" name="doctor" class="layui-input-inline">
				</select>
			</div>
		</div>

		<div class="layui-row row">
			<div class="layui-col-xs3 layui-col-xs-offset1 layui-col-sm2 layui-col-sm-offset1 layui-col-md2 layui-col-md-offset2">
				<span class="layui-form-label">所属时间: </span>
			</div>
			<div class="layui-col-xs5 layui-col-sm3 layui-col-md2">
				<input id="dateTime" class="layui-input" type="text" readonly>
			</div>
		</div>

		<div id="div_diseaseName" class="layui-row row">
			<div class="layui-col-xs3 layui-col-xs-offset1 layui-col-sm2 layui-col-sm-offset1 layui-col-md2 layui-col-md-offset2">
				<span class="layui-form-label">诊断结果: </span>
			</div>
			<div class="layui-col-xs7 layui-col-sm4 layui-col-md3">
				<textarea id="diseaseName" name="diseaseName" placeholder="请输入内容(400字以内)" class="layui-textarea" style="resize: none;min-height: 140px;"></textarea>
			</div>
		</div>
		
		<div class="layui-row row content_center">
			<button id="btn_return" class="layui-btn layui-btn-radius layui-btn-normal">上一步</button>
		</div>
	</div>

	<div id="div_clientTable" class="layui-form layui-container" style="">
		<div id="div_client" class="layui-row row">
			<div class="layui-col-xs3 layui-col-xs-offset1 layui-col-sm2 layui-col-sm-offset1 layui-col-md2 layui-col-md-offset2">
				<span class="layui-form-label">所属病人: </span>
			</div>
			<div class="layui-col-xs5 layui-col-sm3 layui-col-md2">
				<input id="client" class="layui-input" type="text" placeholder="病人姓名">
			</div>
			<!-- <div class="layui-col-xs2 layui-col-xs-offset1 layui-col-sm1 layui-col-sm-offset1 layui-col-md1 layui-col-md-offset1">
				<button id="btn_search" class="layui-btn layui-btn-mini">
					<i class="layui-icon">&#xe615;</i> 查询
				</button>
			</div> -->
		</div>
		
		<div class="layui-row row content_center">
			<table class="layui-table" lay-skin="line row" id="tb_clientTable" lay-filter="tableListen" lay-even></table>
		</div>
		
		<div class="layui-row row content_center">
			<button id="btn_next" class="layui-btn layui-btn-radius layui-btn-normal">下一步</button>
		</div>
	</div>

</body>
<script src="/Hospital/lib/jquery.min.js" charset="utf-8"></script>
<script src="/Hospital/lib/layui-v2.1.6/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript">

	var client ={};//选中客户
	
	layui.use([ "laydate", "form", "layer","table" ], function() {
		var $ = layui.jquery;
		var form = layui.form;
		var table = layui.table; //调用layui插件里的表格模块
		var laydate = layui.laydate; //调用Layui插件里的时间组件
		var layer = layui.layer;

		initFrame();//初始化窗口

		//初始化窗口
		function initFrame() {
			var loginUser = JSON.parse(localStorage.getItem("loginUser"));
			
			btnSearchEvent();//搜索按钮监听事件
			btnNextEvent(); //下一步按钮监听事件
			btnReturnEvent(); //上一步按钮监听事件
			initDateTime(); //初始化日期
			
			renderTable([]);
			
			//初始化门诊名
			$("#clinic").val(loginUser.clinicName);
			$("#clinic").attr("data-id", loginUser.clinicId);
			if (loginUser.permission.createTreatBill != 0) {
				//具有创建治疗单据(所有)权限
				initDepartmentSelect(loginUser);//初始化科室下拉栏和医生下拉栏
				selectEvent();//科室下拉框监听事件
			} else if (loginUser.permission.createTreatBillPerson != 0) {
				//具有创建治疗单据(个人)权限
				var departmentId = loginUser.departmentId;
				var departmentName = loginUser.departmentName;
				var employeeId = loginUser.employeeId;
				var name = loginUser.employeeName;
				$("#department").append(
						"<option value="+departmentId+">" + departmentName + "</option>");
				$("#doctor").append("<option value="+employeeId+">" + name + "</option>");
				$("#department").attr("disabled", "");
				$("#doctor").attr("disabled", "");
			} else {
				console.error("权限不足");
			}

			form.render();
		}
		
		//搜索按钮监听事件
		function btnSearchEvent() {
			$("#btn_search").on("click", function() {
				var param = {
					searchParam : $("#client").val()
				};
				initTable(param);
			});
			
			$('#client').change(function() {
				var param = {
					searchParam : $("#client").val()
				};
				initTable(param);
			});
		}
		
		//param:搜索参数
		function initTable(param) {
			console.log("initTable.param");
			console.log(param);
			$.ajax({
				type : 'post',
				url : "/Hospital/userController/searchClient",
				data : param,
				success : function(response) {
					if(response.code == 414) {
						layer.msg("找不到病人");
						return;
					}
					if(response.code != 200 && response.code != 414) {
						console.error(response);
						return;
					}
					console.log("initTable.response");
					console.log(response);
					renderTable(response.result);
					
				}
			});
		}
		
		function initDepartmentSelect(loginUser) {
			var param = {
				clinicId : loginUser.clinicId,
			};
			$.ajax({
				type : "post",
				url : "/Hospital/clinicController/getClinicAllDepartment",
				data : param,
				success : function(response) {
					if (response.code != 200) {
						console.error(response);
						return;
					}
					//console.log("importTreatBill.getClinicAllDepartment");
					//console.log(response);
					var result = response.result;
					for (var i = 0; i < result.length; i++) {
						var departmentId = result[i].departmentId;
						var departmentName = result[i].departmentName;
						var name = result[i].name;
						$("#department").append(
								"<option value="+departmentId+">" + departmentName + "</option>");
					}
					var dpmId = $("#department").val();
					initDoctorSelect(dpmId);//初始化医生下拉栏
					//重绘
					form.render();
				}
			});
		}
		
		function renderTable(data) {
			var tableWidth = $(document.body).width() * 0.2;	//数据表格大列宽
			var tableHeight = $(document.body).height() * 0.780; //数据表格高度
			var rightFixed = $(document.body).width() * 0.13;  //数据表格操作宽度
			var sexWidth = $(document.body).width() * 0.15;	//数据表格小列宽度
			var identityWidth = $(document.body).width() * 0.35;
			
			table.render({
				id : "tb_clientTable",
				elem : "#tb_clientTable",
				center : true,
				page : true, //分页
				limit : 10, //每页显示条数
				height: 'full-130',				
				cols : [ [ 
							{field : 'name',width : tableWidth,title : '姓名',align : 'center',event : "clickRow"},
							{field : 'identity',width : identityWidth,title : '身份证',align : 'center',event : "clickRow"}, 
							{field : 'sex',width : sexWidth,title : '性别',align : 'center',event : "clickRow"}, 
							{field : 'birthdate',width : tableWidth,title : '出身日期',align : 'center',event : "clickRow"}, 
						] ],
				data : data
			});
			//监听单元格事件
			table.on('tool(tableListen)', function(obj){
				var data = obj.data;
				if(obj.event === 'clickRow'){	//行点击事件
					client = data;
				}
			});
		}
		
		function initDoctorSelect(departmentId) {
			var param = {
				departmentId : departmentId,
			};
			//console.log("initDoctorSelect.param");
			//console.log(param);
			$.ajax({
				type : "post",
				url : "/Hospital/userController/getDepartmentEmployee",
				data : param,
				success : function(response) {
					if (response.code != 200 && response.code != 414) {
						console.error(response);
						return;
					}
					$("#doctor").append("<option value=''></option>");
					var result = response.result;
					for (var i = 0; i < result.length; i++) {
						var employeeId = result[i].employeeId;
						var name = result[i].name;
						$("#doctor").append("<option value="+employeeId+">" + name + "</option>");
					}
					//重绘
					form.render();
				}
			});
		}

		function initDateTime() {
			var nowdate = new Date(); //获取当前时间
			var nowYear = nowdate.getFullYear() + "-" + (nowdate.getMonth() + 1) + "-"
					+ nowdate.getDate();//获取当前年份
			var max = nowdate.getFullYear() + "-" + (nowdate.getMonth() + 1) + "-"
					+ nowdate.getDate();
			var min = nowdate.getFullYear() + "-" + (nowdate.getMonth() + 1) + "-01";
			laydate.render({ //执行一个laydate实例
				elem : '#dateTime', //指定元素
				theme : "#55565b",
				value : nowYear,
				max : max,
				min : min
			});
		}

		//科室下拉框监听事件
		function selectEvent() {
			form.on('select(department)', function(data) {
				$("#doctor").empty();
				initDoctorSelect(data.value);
			});
		}

		//下一步按钮
		function btnNextEvent() {
			$("#btn_next").on("click", function() {
				console.log("btn_next.client");
				console.log(client);
				if(isEmptyObject(client)) {
					layer.msg("请选择病人");
					return;
				}
				hide("#div_clientTable");
				show("#div_doctorTable");
			});
		}
		
		//上一步按钮监听事件
		function btnReturnEvent() {
			$("#btn_return").on("click", function() {
				hide("#div_doctorTable");
				show("#div_clientTable");
			});
		}
	});

	//设置病人信息为空
	function setClinetInfoEmpty() {
		$("#clientId").val("");
		$("#name").val("");
		$("#sex").val("");
		$("#phone").val("");
	}

	//隐藏块
	function hide(id) {
		$(id).css({
			"display" : "none"
		});
	}
	
	//显示块
	function show(id) {
		$(id).css({
			"display" : "block"
		});
	}
	
	//判断对象是否为空
	function isEmptyObject (obj) {
		for ( var name in obj ) {
			return false;
		}
		return true;
	} 
	
	//获取窗口数据
	function initParam() {
		if(isEmptyObject(client)) {
			client = {"clientId" : ""};
		}
		
		var param = {
			clinicId : $("#clinic").attr("data-id"),
			clinicName : $("#clinic").val(),
			departmentId : $("#department").val(),
			departmentName : $("#department").find("option:selected").text(),
			doctorId : $("#doctor").val(),
			doctorName : $("#doctor").find("option:selected").text(),
			dateTime : $("#dateTime").val(),
			clientId : client.clientId,
			clientName : client.name,
			diseaseName : $("#diseaseName").val(),
		};
		//console.log($("#clientId").val());
		//localStorage.setItem("importTreatBillParam", JSON.stringify(param));
		return param;
	}
</script>
</html>
